• HTML
  • CSS
  • JS

    Temas HTML

  • Estructura

  • Etiquetas Generales

  • Listas

  • Metadatos

  • Representar código

  • Multimedia

  • Tablas

  • Eventos

  • Formularios

  • Validaciones

  • Envío de Datos

  • Controladores JS

  • Pre-Carga

  • Recordatorios

Etiquetas de texto

Este apartado trata sobre todas aquellas etiquetas cuya función consiste en modificar o ajustar la forma en la que se visualizará el texto de un elemento.

Abbr

Se trata de una etiqueta para definir las abreviaturas; su efecto es que la abreviatura o el acrónimo se mostrará con un subrayado punteado y, al posicionar el ratón sobre este, se mostrará un texto emergente con la expresión completa del término. Para definir la expresión completa se utiliza el atributo "title", seguido de la expresión.

B

Su función únicamente es la de mostrar el texto que se encuentre dentro de esta etiqueta en negritas; no añade ningún valor semántico a este.

Em

Se usa para dar un poco de énfasis o relevancia a algún texto; el texto dentro de esta etiqueta se muestra en cursiva.

I

Consiste en una etiqueta para mostrar el texto en cursiva o itálica; no brinda ningún valor semántico.

Span

Tal y como se mencionó en el apartado de etiquetas de estructura, se trata de una etiqueta no semántica de texto; por lo tanto, su función es incorporarlo en el interior de un texto para hacer posible distinguir algún área del mismo sin añadirle valor semántico. Esto se puede lograr usando el atributo "class" para poder incorporar CSS.

Nota: por sí mismo, el navegador no muestra algún estilo en particular al texto que se encuentre en este elemento.

Superíndice y Subíndice

En ocasiones puede ser necesario incorporar estos elementos en algún texto; para ello existen estas dos etiquetas:

  • sup: Esta etiqueta se usa para definir el superíndice; lo hace encasillando a este en su interior.

  • sub: Esta etiqueta se usa para definir el subíndice; lo hace encasillando a este en su interior.

Un ejemplo de ambos casos es el siguiente:

Código

Visualización

Strong

Se usa para darle gran importancia al texto dentro de esta etiqueta; se muestra como texto en negritas.

U

Su función únicamente es la de mostrar el texto que se encuentre dentro de este subrayado; no añade ningún valor semántico a este.

Etiquetas para Citar Contenido

Una peculiaridad de HTML es que, entre tantos elementos, también existen algunos con la función específica de estructurar las citas de texto de forma adecuada. En base al tipo de cita, se emplea un elemento diferente según el caso.

Citas en bloque independiente

Para estos casos se utiliza el elemento <blockquote>, el cual debe encasillar una etiqueta "p" con la cita. Esta se mostrará como un párrafo con sangría a la izquierda y derecha; también es importante utilizar el atributo "cite=' '", en el cual se puede ingresar una URL que apunte a la fuente de la cita.

Ejemplo

Nota: Este tipo de cita indica que es una cita ampliada.

Citas en Línea

Estas funcionan igual que las citas en bloque, con la diferencia de que se utiliza la etiqueta "q", la cual se incorpora dentro del elemento "p", encasillando únicamente las palabras deseadas. El resultado será que la cita se mostrará entre comillas.

Nota: Estas indican que se trata de una cita breve que no necesita de un salto de línea.

Incorporar la Fuente de la Página

El atributo "cite" parece útil, pero los buscadores o motores de lectura no suelen mostrarlo visualmente. Por lo tanto, la mejor forma de incorporar la fuente en la página es utilizando un enlace (a); para esto, simplemente incorporamos este elemento en la redacción de forma que el enunciado o el tipo de cita lo permita, con la URL que dirija a la fuente deseada.

Contacto

¿Quién soy?

Mi nombre es Carlos Miguel Puche Moreno, estoy estudiando programación web de forma autodidacta. Si quieres saber más, visita mi perfil de GitHub haciendo clic en mi fotografía, o visita mis redes sociales:

Redes

Currículum